import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:flutter_wan_android/entity/article_entity.dart';
import 'package:flutter_wan_android/manager/router_manger.dart';
import 'package:flutter_wan_android/widget/wrapper_image.dart';
import 'package:quiver/strings.dart';

import 'article_tag_widget.dart';

class ArticleItemWidget extends StatelessWidget {
  final ArticleEntity article;
  final int index;
  final GestureTapCallback onTap;

  /// 首页置顶
  final bool top;

  /// 隐藏收藏按钮
  final bool hideFavourite;

  ArticleItemWidget(this.article, {this.index, this.onTap, this.top: false, this.hideFavourite: false})
      : super(key: ValueKey(article.id));

  @override
  Widget build(BuildContext context) {
    var backgroundColor = Theme.of(context).scaffoldBackgroundColor;

    /// 用于Hero动画的标记
    //UniqueKey uniqueKey = UniqueKey();
    return Stack(
      children: <Widget>[
        Material(
          ///首页置顶修改颜色
          color: top ? Theme.of(context).accentColor.withAlpha(10) : backgroundColor,
          child: InkWell(
            onTap: onTap ??
                () {
                  RoutesManager.getInstance().pushArticleDetailPage(context, article);
                },
            child: Container(
              padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 0),
              margin: const EdgeInsets.symmetric(horizontal: 20),
              decoration: BoxDecoration(
                  border: Border(
                bottom: Divider.createBorderSide(context, width: 0.7),
              )),

              ///边框
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  ///第一行
                  Row(
                    children: <Widget>[
                      ///用户头像,随机图像
                      ClipOval(
                        child: WrapperImage(
                          imageType: ImageType.random,
                          url: article.author,
                          height: 20,
                          width: 20,
                        ),
                      ),

                      ///用户昵称
                      Padding(
                        padding: const EdgeInsets.only(left: 5),
                        child: Text(
                          isNotBlank(article.author) ? article.author : article.shareUser ?? '',
                          style: Theme.of(context).textTheme.caption,
                        ),
                      ),

                      ///空间
                      Expanded(
                        child: SizedBox.shrink(),
                      ),

                      ///发布时间
                      Text(article.niceDate, style: Theme.of(context).textTheme.caption),
                    ],
                  ),

                  ///第二行
                  ///文章缩略图不存在显示标题
                  if (article.envelopePic.isEmpty)
                    Padding(
                      padding: EdgeInsets.only(top: 7),
                      child: ArticleTitleWidget(article.title),
                    )
                  else

                    ///文章缩略图存在显示标题/缩略图
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        Expanded(
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: <Widget>[
                              ///文章标题
                              ArticleTitleWidget(article.title),
                              SizedBox(
                                height: 2,
                              ),

                              ///文章描述
                              Text(
                                article.desc,
                                style: Theme.of(context).textTheme.caption,
                                overflow: TextOverflow.ellipsis,
                                maxLines: 1,
                              ),
                            ],
                          ),
                        ),
                        SizedBox(
                          width: 5,
                        ),

                        ///文章缩略图
                        WrapperImage(
                          url: article.envelopePic,
                          height: 60,
                          width: 60,
                        ),
                      ],
                    ),
                  Row(
                    children: <Widget>[
                      if (top) ArticleTagWidget("置顶"),
                      ///添加分类
                      Padding(
                        padding: EdgeInsets.symmetric(vertical: 5),
                        child: Text(
                          (article.superChapterName != null ? article.superChapterName + ' -> ' : '') +
                              (article.chapterName ?? ''),
                          style: Theme.of(context).textTheme.overline,
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ),
        ),
        Positioned(
          bottom: 0,
          right: 0,
          child: SizedBox.shrink()
              // hideFavourite
              // ? SizedBox.shrink()
              // : Consumer<GlobalFavouriteStateModel>(
              //     builder: (context, model, child) {
              //       //利用child局部刷新
              //       if (model[article.id] == null) {
              //         return child;
              //       }
              //       return ArticleFavouriteWidget(article..collect = model[article.id], uniqueKey);
              //     },
              //     child: ArticleFavouriteWidget(article, uniqueKey),
              //   ),
        )
      ],
    );
  }
}

class ArticleTitleWidget extends StatelessWidget {
  final String title;

  ArticleTitleWidget(this.title);

  @override
  Widget build(BuildContext context) {
    return Html(
      data: title,
    );
  }
}

/// 收藏按钮
// class ArticleFavouriteWidget extends StatelessWidget {
//   final ArticleEntity article;
//   final UniqueKey uniqueKey;
//
//   ArticleFavouriteWidget(this.article, this.uniqueKey);
//
//   @override
//   Widget build(BuildContext context) {
//     return ProviderWidget<FavouriteModel>(
//       model: FavouriteModel(globalFavouriteModel: Provider.of(context, listen: false)),
//       builder: (_, favouriteModel, __) => GestureDetector(
//           behavior: HitTestBehavior.opaque, //否则padding的区域点击无效
//           onTap: () async {
//             if (!favouriteModel.isBusy) {
//               addFavourites(context, article: article, model: favouriteModel, tag: uniqueKey);
//             }
//           },
//           child: Padding(
//               padding: const EdgeInsets.fromLTRB(20, 20, 20, 10),
//               child: Hero(
//                 tag: uniqueKey,
//                 child: ScaleAnimatedSwitcher(
//                     child: favouriteModel.isBusy
//                         ? SizedBox(height: 24, width: 24, child: CupertinoActivityIndicator(radius: 5))
//                         : Consumer<UserModel>(
//                             builder: (context, userModel, child) => Icon(
//                                 userModel.hasUser && article.collect ? Icons.favorite : Icons.favorite_border,
//                                 color: Colors.redAccent[100]),
//                           )),
//               ))),
//     );
//   }
// }
